import Vue from 'vue';
import VueRouter from 'vue-router';
import Main from '../views/Main.vue';

const Recommend = () => import('../views/pages/Recommend.vue');
const Hall = () => import('../views/pages/Hall/index.vue');
const Video = () => import('../views/pages/Video.vue');
const Like = () => import('../views/pages/Like.vue');
const Featured = () => import('../views/pages/Hall/components/Featured.vue');
const Rank = () => import('../views/pages/Hall/components/Rank.vue');
const Artist = () => import('../views/pages/Hall/components/Artist.vue');
const PlayList = () => import('../views/pages/Hall/components/PlayList.vue');

Vue.use(VueRouter);

const routes = [
  {
    path: '/',
    name: 'Main',
    component: Main,
    redirect: '/hall',
    children: [
      {
        name: 'recommend',
        component: Recommend,
        path: '/recommend',
      },
      {
        name: 'hall',
        component: Hall,
        path: 'hall',
        redirect: '/hall/featured',
        children: [
          {
            name: 'featured',
            component: Featured,
            path: 'featured',
          },
          {
            name: 'rank',
            component: Rank,
            path: 'rank',
          },
          {
            name: 'artist',
            component: Artist,
            path: 'artist',
          },
          {
            name: 'playlist',
            component: PlayList,
            path: 'playlist',
          },
        ],
      },
      {
        name: 'video',
        component: Video,
        path: '/video',
      },
      {
        name: 'like',
        component: Like,
        path: '/like',
      },
    ],
  },
];

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes,
});

export default router;
